import React from "react";
import { Button, type ButtonProps } from "antd";
import { usePermission } from "@/hooks/usePermission";

interface PermissionButtonProps extends ButtonProps {
  permission?: string;
  role?: string;
}

const PermissionButton: React.FC<PermissionButtonProps> = ({
  permission,
  role,
  children,
  ...restProps
}) => {
  const { hasPermission, hasRole } = usePermission();

  // 如果没有提供权限或角色，则默认显示
  if (!permission && !role) {
    return <Button {...restProps}>{children}</Button>;
  }

  // 检查权限或角色
  const hasAccess =
    (permission && hasPermission(permission)) || (role && hasRole(role));

  if (!hasAccess) {
    return null;
  }

  return <Button {...restProps}>{children}</Button>;
};

export default PermissionButton;
